<!--
  Copyright (c) 2018-2999 广州市蓝海创新科技有限公司 All rights reserved.

  https://www.mall4j.com/

  未经允许，不可做商业用途！

  版权所有，侵权必究！
-->

<template>
  <div class="Mall4j good-list-page">
    <div class="goods-content-page">
      <goods-list-component :config="config" />
    </div>
  </div>
</template>
<script setup>
import goodsListComponent from '../goods-component/goods-list-component/index.vue'

const props = defineProps({
  itemComponent: {
    type: Object,
    default: () => {}
  }
})

const config = ref({
  datalist: []
})

watch(() => props.itemComponent, (newVal) => {
  if (JSON.stringify(newVal.rightConfigMessage) !== '{}') {
    config.value = {
      showMany: newVal.rightConfigMessage.listType,
      showName: newVal.rightConfigMessage.showContent.find(item => Number(item) === 0) ? 0 : 1,
      showDescription: newVal.rightConfigMessage.showContent.find(item => Number(item) === 1) ? 0 : 1,
      showPrice: newVal.rightConfigMessage.showContent.find(item => Number(item) === 1) ? 0 : 1,
      listTypeList: new Array(newVal.rightConfigMessage.listType),
      dataList: newVal.rightConfigMessage.goodsList
    }
  }
}, { immediate: true, deep: true })

</script>
<style lang="scss" scoped>
.good-list-page {
  width: 100%;
  max-width: 1920px;
  min-width: 1200px;
  margin: 0 auto;
  .goods-content-page {
    width: 1200px;
    margin: 0 auto;
  }
}

</style>
